<template>
<!-- 这个是帮助界面的组件 -->
    <div class="bj">
        <!-- tab标签 -->
        <div class="container help-waimian">
            <div class="help-title">
                <router-link to="/shouye" class="tiaozhuan">首页</router-link>>房源搜索
            </div>
            <div class="help-left">
                <ul id="myTab" class="nav nav-tabs">
                    <li class="active">
                        <a href="#login" data-toggle="tab" class="left-one">登录注册</a>
                    </li>
                    <li>
                        <a href="#search" data-toggle="tab" class="left-two">房源搜索</a>
                    </li>
                    <li>
                        <a href="#lianxi" data-toggle="tab" class="left-one">联系房东</a>
                    </li>
                    <li>
                        <a href="#yuding" data-toggle="tab" class="left-two">预定房源</a>
                    </li>
                     <li>
                        <a href="#zhifu" data-toggle="tab" class="left-two">支付定金</a>
                    </li>
                    <li>
                        <a href="#caozuo" data-toggle="tab" class="left-one">订单操作</a>
                    </li>
                    <li>
                        <a href="#ruzhu" data-toggle="tab" class="left-two">入住事宜</a>
                    </li>
                     <li>
                        <a href="#pinglun" data-toggle="tab" class="left-two">入住评论</a>
                    </li>
                    <li>
                        <a href="#yhj" data-toggle="tab" class="left-one">优惠劵</a>
                    </li>
                </ul>
            </div>
    
            <!-- 每个tab页对应的内容 -->
    
            <div id="myTabContent" class="tab-content help-right">

                <!-- 登陆注册 -->

                <div class="tab-pane fade in active" id="login">
                    <div class="baoguo">
    
                        <div class="right-zhengti">
    
    
    
                            <div class="right-kuaititle">登陆/注册</div>
    
    
    
                            <el-collapse v-model="activeNames" @change="handleChange">
    
    
    
                                <el-collapse-item class="right-title" title="怎么登录注册？" name="1">
    
    
    
                                    <div class="right-futitle">登录“Airbnb”网站（www.airbnb.com），点击页面右上方的“注册/登录”，使用手机及动态验证码即可完成注册登录，未注册的手机号将自动创建为Airbnb帐户</div>
    
    
    
                                </el-collapse-item>
    
    
    
                                <el-collapse-item class="right-title" title="注册时需要注意些什么？" name="2">
    
    
    
                                    <div class="right-futitle">请真实签写你的资料，电子邮件和手机号是您以后收取和核对订单的重要方式；手机号一旦注册不能更改。</div>
    
    
    
                                </el-collapse-item>
    
    
    
                                <el-collapse-item class="right-title" title="效率 Efficiency" name="3">
    
    
    
                                    <div class="right-futitle">能够使用他人的或者废弃的手机号注册？</div>
    
    
    
                                </el-collapse-item>
    
    
    
                                <el-collapse-item class="right-title" title="一个手机号可以注册多个账号吗？" name="4">
    
    
    
                                    <div class="right-futitle">不可以。一个“Airbnb”账号绑定唯一手机号码。</div>
    
    
    
                                </el-collapse-item>
    
    
    
                            </el-collapse>
    
    
    
                            <!-- <div class="right-kuaititle">登陆/注册</div> -->
    
    
    
                        </div>
    
    
    
                        <div class="right-zhengtitwo">
    
    
    
                            <div class="right-kuaititletwo">个人信息修改</div>
    
    
    
                            <el-collapse v-model="activeNames" @change="handleChange">
    
    
    
                                <el-collapse-item class="right-title" title="为什么用户名不能使用手机、QQ、微信、邮箱等联系方式？" name="5">
    
    
    
                                    <div class="right-futitle">为了避免信息泄露可能带来未知风险，手机号码、QQ号、微信、邮箱地址等个人联系方式无法作为用户名使用。</div>
    
    
    
                                </el-collapse-item>
    
    
    
                                <el-collapse-item class="right-title" title="如何修改我的个人信息？" name="6">
    
    
    
                                    <div class="right-futitle">您登录“蚂蚁”账号进入“我是房东”/“账号昵称：“我的设置”后，在“我的设置” -> “个人信息”中修改、更新您的个人信息，提交后即生效。</div>
    
    
    
                                </el-collapse-item>
    
    
    
                                <el-collapse-item class="right-title" title="如何修改账号密码？" name="7">
    
    
    
                                    <div class="right-futitle">简化流程：设计简洁直观的操作流程；</div>
    
    
    
                                </el-collapse-item>
    
    
    
                                <el-collapse-item class="right-title" title="如何修改账号绑定手机？" name="8">
    
    
    
                                    <div class="right-futitle">您登录“蚂蚁”账号进入“我是房东”/“账号昵称”后，在“我的设置”->“个人信息”更改手机号，更改的手机号必须没有注册过“蚂蚁”账号。</div>
    
    
    
                                </el-collapse-item>
    
    
    
                            </el-collapse>
    
    
    
                        </div>
    
                    </div>
                </div>
                <!-- 搜索 -->
                <div class="tab-pane fade" id="search">
                    <div class="baoguo">
    
                        <div class="right-zhengti">
                            <div class="right-kuaititle">房源类别</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="蚂蚁网站上能找到什么样的房子？" name="1">
                                    <div class="right-futitle">"蚂蚁"上可以找到的房屋类型很多，从独栋别墅到林间小屋，从简约公寓到家庭民宿……还有不少和当地景点结合的特色房屋！</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="我怎么样看出房间是好是坏？" name="2">
                                    <div class="right-futitle">查看先前入住的客人们留下的评论怎么说、房东是不是用心的完善了他们的资料、房东的回复率和成交率高不高、房间的照片是否能从多个角度或层次反映状况等。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
    
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititletwo">房源详情</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                              <el-collapse-item class="right-title" title="页面信息房间地址不详细，我如何找到房间所在具体位置？" name="3">
                                    <div class="right-futitle">在房间页面有“位置地图”选项，点击查看可以浏览房间的大概位置；在您支付订金后将收到我们发出的包含房东联系方式及房屋具体地址的信息通知；您也可以在入住前与房东取得联系得到详细地址。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="页面信息中“实拍”标志是什么意思？" name="4">
                                    <div class="right-futitle">“实拍”表示该房间是由“蚂蚁”的专业摄影师上门拍摄，照片真实有效，包括房间照片、地理位置、房间描述、配套设施等都是真实可信的，您可以放心入住。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="我有很多关于租房的问题，比如说停车位、钥匙交付、路标等，我该向谁询问？" name="5">
    
                                    <div class="right-futitle">实际上，如果房间详情描述页内没有列出您需要的信息，您还可以直接和该房屋的房东联系以询问更多问题。点击房东头像下方的绿色按钮"在线聊天"，询问更多该房间的相关信息。；</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="如何能快速找到我想要的房间？" name="6">

                                    <div class="right-futitle">充分利用“蚂蚁”页面提供的搜索或筛选功能，根据您输入的条件，例如：入住时间、房间价格、行政区域、房屋类型、设施服务等，向您展示匹配的房间列表。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="房间信息中的押金及额外收费包含在房租中吗？" name="7">
                                    <div class="right-futitle">不包含。如是线上收取押金，需要在支付订金时一同进行支付，其他额外费用在办理入住时支付给房东；如是线下收取押金，则押金与额外收费均在办理入住时支付给房东。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="为什么每天的价格不一样？如何查看每天的价格是多少，房间是否可租？" name="8">
                                    <div class="right-futitle">房东会根据节假日等特殊日期设定特殊价格。通过点击全部日历，即可查看每天的价格，显示为绿色的日期表示有房可租，黄色的为特殊价，灰色的为无房不可租。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititle">房源类别</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="蚂蚁网站上能找到什么样的房子？" name="9">
                                    <div class="right-futitle">"蚂蚁"上可以找到的房屋类型很多，从独栋别墅到林间小屋，从简约公寓到家庭民宿……还有不少和当地景点结合的特色房屋！</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                    </div>
                </div>
                <!-- 联系 -->
                <div class="tab-pane fade" id="lianxi">
                    <div class="baoguo">
    
                        <div class="right-zhengti">
                            <div class="right-kuaititle">在线消息</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="如何与房东取得联系？" name="1">
                                    <div class="right-futitle">“蚂蚁”提供强大的在线沟通工具，您可以通过点击“在线聊天”联系房东。为维护“蚂蚁”平台交易秩序、保护交易双方的隐私安全，订单成交前请不要向房东索要及提供联系方式。待订单支付成功后，“蚂蚁”会向交易双方互发详细联系方式，以便您与房东更深入的交流。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="如何查看历史消息？" name="2">
                                    <div class="right-futitle">登录“蚂蚁”账号，在“账号昵称”->“消息通知”中进行查看；也可以APP登录“蚂蚁”账号，“消息”中进行查看。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="预订成功后如何查看房东的联系方式？" name="3">
                                    <div class="right-futitle">预订成功后，您可以在“账号昵称” ->”我的订单”->”订单管理”->”订单详情”中查看房东的具体信息，包括房东昵称、电话等。</div>
                                    <div class="right-futitle">也可通过APP订单详情拨打房东电话或发送站内信消息。</div>
                                    <div class="right-futitle">“蚂蚁”也会将房东手机号和房间地址发送短信至您注册的手机号，方便您与房东建立联系。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
    
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititletwo">注意事项</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                              <el-collapse-item class="right-title" title="房东约我私下联系怎么办？" name="4">
                                    <div class="right-futitle">为了维护“蚂蚁”平台交易秩序、保护交易双方的隐私及安全，请您拒绝此类要求，坚持在“蚂蚁”平台上交易。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="与房东沟通时需要注意些什么？" name="5">
                                    <div class="right-futitle">您向房东发起咨询时，建议您详细介绍您的出行目的、入住人数、入住天数等，并提出您所关心但房源页面中未提及的入住问题，良好的沟通有助于您找到最佳居所。为了保障房东房客双方的在线交易安全，“蚂蚁”禁止交易双方互相提供联系方式，包括但不限于手机号码、QQ、微信、邮箱地址、网址等，系统会自动屏蔽此类违规消息。请您在线沟通时注意，不要涉及此类内容，遵守“蚂蚁”安全交易规则，谨防诈骗等违法行为。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                    </div>
                </div>
                <!-- 预定 -->
                <div class="tab-pane fade" id="yuding">
                    <div class="baoguo">
                        <div class="right-zhengti">
                            <div class="right-kuaititletwo">预订流程</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                              <el-collapse-item class="right-title" title="如何预订房间？" name="1">
                                    <div class="right-futitle">登录“蚂蚁”账号，选定房间后，选择入住日期和退房日期，点击“立即预订”，进入预订页，填写入住人信息，确认订单信息无误后，点击“提交订单”即可。房东接受预订后，您需要在限定时间内支付相应订金以完成订单。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="在蚂蚁短租预订房间需要支付多少费用，有没有额外支付其他费用？" name="2">
                                    <div class="right-futitle">您只需要根据房东设置支付房款总额20%、50%或全额的订金即可，除支付房款订金之外无须支付任何其他费用。</div>
                                </el-collapse-item>
                              <el-collapse-item class="right-title" title="为什么我点击“立即预订”时提示房间已有人预订？" name="3">
                                    <div class="right-futitle">这表示有其他房客在您之前已经预订了此时段的房间，您可以选择其他时段或预订其他房间。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="为什么搜索房间时看到的价格和提交订单时的价格不一样？" name="4">
                                    <div class="right-futitle">未选择入住退房时间搜索房间时您看到的是房间的日价（日常价格），提交订单时显示的是具体入住时期的实际价格，由于特殊时段房东可能会设置特殊价格，或订单为长期折扣订单，从而导致这实际价格的差异。最终订金请以房东确认订单后的价格为准。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="我的预订请求会在多长时间内响应？" name="5">
    
                                    <div class="right-futitle">您提交订单后“蚂蚁”会通过短信、APP提醒、微信房东管家等方式通知房东处理您的订单，如您等待时间过长，可联系蚂蚁客服400-028-6868催促房东确认订单。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="房东接受我的订单后我要怎么办？" name="6">

                                    <div class="right-futitle">请您尽快支付订金以确保能够预订到房间，支付时限为12小时，逾期则订单失效。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="房间信息中的押金及额外收费包含在房租中吗？" name="7">
                                    <div class="right-futitle">建议您仔细浏览房间的介绍信息、交易规则等，与房东进行充分的在线沟通，表明您的出行目的、出行时间、入住人数及入住需求，待双方充分的了解后再进行预订。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="我在订房之前能不能实地看房？" name="8">
                                    <div class="right-futitle">我们不鼓励在“蚂蚁”订房之前进行私下沟通或见面。“蚂蚁”会将用户的注册信息和付款信息作为隐私的安全信息进行备份，用以给您提供安全可靠的交易保障。如果您想了解更多房间的实景信息，您可以通过在线聊天联系房东咨询。如进行线下交易，“蚂蚁将无法保证您的交易安全。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititle">特权订单</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="什么是芝麻信用免押金？" name="9">
                                    <div class="right-futitle">在蚂蚁短租，若您的芝麻信用分≥600，可享受优质房源入住免押金的特权服务（免押金房源会有相应标示）</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="速订是什么？订房流程有什么不同？" name="9">
                                    <div class="right-futitle">速订是“蚂蚁”推出的一种快速订房方式。速订的房源在房客预订时不需要等待房东确认，支付成功，订单即预订成功，其他流程不变。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                    </div>
                </div>
                <!-- 支付定金 -->
                <div class="tab-pane fade" id="search">
                    <div class="baoguo">
    
                        <div class="right-zhengti">
                            <div class="right-kuaititle">支付方式</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="可以用什么方式支付订金？" name="1">
                                    <div class="right-futitle">电脑和APP：支付宝、银联在线支付平台所支持的国内银行卡及信用卡、微信均可支付。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
    
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititletwo">支付时效</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                              <el-collapse-item class="right-title" title="为什么支付订金时显示订单失效？" name="2">
                                    <div class="right-futitle">很有可能是因为您未在规定时间内成功支付订金。房东接受了您的预订请求后，您需在12小时内支付订金。</div>
                                </el-collapse-item>
                               
                            </el-collapse>
                        </div>
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititle">费用详情</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="为什么付款的时候实际付款额比房租多？" name="3">
                                    <div class="right-futitle">请查看您预订的房源是否要求在线支付押金，在线支付押金的房源在付款时押金连同订金一并进行支付，由“蚂蚁”全程保管，如房间物品无损坏，入住完成后押金退还至您的账户。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="在哪里查看押金金额？" name="4">
                                    <div class="right-futitle">您可以在房源信息页面-交易规则下查看押金的金额。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="什么是在线收取押金？" name="5">
                                    <div class="right-futitle">在线收取押金是房客线上支付押金到蚂蚁，由蚂蚁负责保管及分配款项的保障制度。为了保障押金退款时间及时、有效防范现金交易产生的资金安全问题，部分房东选择在线收取押金。如在入住后就押金处理您与房东出现异议，可申请蚂蚁介入仲裁。
                                  </div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                    </div>
                </div>
                <!-- 订单操作 -->
                <div class="tab-pane fade" id="caozuo">
                    <div class="baoguo">
    
                        <div class="right-zhengti">
                            <div class="right-kuaititle">订单查询</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="怎样查看订单信息？" name="1">
                                    <div class="right-futitle">登录“蚂蚁”，进入“账号昵称”，在“我的订单”->“订单管理”中进行查询。或在APP中“订单”中查看。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
    
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititletwo">取消订单</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                              <el-collapse-item class="right-title" title="如何取消订单？" name="2">
                                    <div class="right-futitle">登录账号后，在订单-选择需要取消的订单，进入订单详情，最下方有“取消订单”按钮，点击按钮即可。需要注意的是：目前【入住中】订单暂不支持自行办理取消，提前退房请点击页面右上角“客服”帮忙处理。</div>
                                </el-collapse-item>
                               
                            </el-collapse>
                        </div>
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititle">退/扣款说明</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="支付订单后取消会扣款吗？" name="3">
                                    <div class="right-futitle">如在房东设置的全额退款日之外，则不会扣款，“蚂蚁”将在次日将支付的全部金额退还给您；如在房东设置的全额退款日之内，会根据房东设置的交易规则进行扣款，并在次日退还剩余款项。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="取消已支付的订单后，我何时能收到退款？" name="4">
                                    <div class="right-futitle">根据您支付时所使用的支付方式将退款原路退还，款项具体到账时间以第三方（如支付宝、银行卡等）的处理时间为准。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="什么是退款政策？" name="5">
                                    <div class="right-futitle">退订政策是房东设置的交易规则，交易过程中保护房东房客双方利益的规章制度，订单一旦成立，双方需按此执行。
                                  </div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="速订如何退款？" name="6">
                                    <div class="right-futitle">根据您支付时所使用的支付方式将退款原路退还，款项具体到账时间以第三方（如支付宝、银行卡等）的处理时间为准。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="速订退款什么时候能到账？" name="7">
                                    <div class="right-futitle">根据您支付时所使用的支付方式将退款原路退还，到账日期：支付宝微信1-2个工作日，储蓄卡1-7个工作日，信用卡1-15个工作日。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                    </div>
                </div>
                <!-- 入住事宜 -->
                <div class="tab-pane fade" id="ruzhu">
                    <div class="baoguo">
    
                        <div class="right-zhengti">
                            <div class="right-kuaititle">入住前</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="入住前需要做什么准备？" name="1">
                                    <div class="right-futitle">建议您在入住前联系房东，确认接待和入住时间及详细地址等情况，以便您能够更快捷的入住。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="办理入住时我需要做什么？" name="2">
                                    <div class="right-futitle">请出示有效身份证件（如身份证、护照等），与订单登记的入住人信息一致，方可办理入住，如果房间是线下支付押金，则需要按照房间信息显示金额支付给房东。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="如果我想更改入住时间怎么办？" name="1">
                                    <div class="right-futitle">房东“确认”订单后，您将无法修改入住及退房时间，可以通过登录 “账号昵称”，在“我的订单”中取消原订单重新预订；支付订单后，如果您想要更改入住时间，建议您与房东进行充分沟通协商，是否可以为您另行安排，或取消订单重新预订，需注意是否要扣订金。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="怎样获得入住房间的门匙？" name="2">
                                    <div class="right-futitle">不同的房东有不同的钥匙交接方式。通常，房东会在得到您的联系信息后做出安排。您也可以在订房前直接联系房东询问。。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
    
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititletwo">入住中</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                              <el-collapse-item class="right-title" title="如果我付款后房东不出现该怎么办？" name="3">
                                    <div class="right-futitle">这些行为均属于房东违约行为，请您及时与“蚂蚁”客服人员联系。客服人员会在第一时间核实情况，并根据“蚂蚁”的投诉处理流程标准以及“蚂蚁房客保障计划”进行调查处理。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="我觉得房间与网上描述的不符，我怎么办？" name="4">
                                    <div class="right-futitle">如发现实际入住房间与房间信息描述不符时，请您及时与“蚂蚁”客服人员联系。我们会在第一时间核实情况，建议您将房东提供的房屋进行拍照存证。我们将根据“蚂蚁”的投诉处理流程标准以及“蚂蚁”房客保障计划”进行调查处理。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="如果我抵达后房东才提出他想更换我入住的房间，我应该怎么办？" name="5">
    
                                    <div class="right-futitle">这些行为均属于房东违约行为，请您及时与“蚂蚁”客服人员联系。客服人员会在第一时间核实情况，并根据“蚂蚁”的投诉处理流程标准以及“蚂蚁房客保障计划”进行调查处理。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="如果我抵达后房东提出要另外加价，我应该怎么办？" name="6">
                                    <div class="right-futitle">这些行为均属于房东违约行为，请您及时与“蚂蚁”客服人员联系。客服人员会在第一时间核实情况，并根据“蚂蚁”的投诉处理流程标准以及“蚂蚁房客保障计划”进行调查处理。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititle">入住完成</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="通过“蚂蚁”预订后我还可以在预订中续住吗？" name="9">
                                    <div class="right-futitle">可以。请您登录“蚂蚁”账户，提交需要续住的订单并成功支付即可。如果您直接私下向房东申请续住，入住期间产生的纠纷“蚂蚁”不承担任何责任。请注意：续住需提前与房东进行沟通，并在线预订，以确保房间可租和房价准确。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="如何办理退房？" name="9">
                                    <div class="right-futitle">退房时需交回房间门卡或钥匙，结清账目即完成退房手续。如需延迟退房，请提前与房东沟通协商得到房东的同意。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                    </div>
                </div>
                <!-- 入住评论 -->
                <div class="tab-pane fade" id="pinglun">
                    <div class="baoguo">
    
                        <div class="right-zhengti">
                            <div class="right-kuaititle">评论规则</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="什么时候可以对房间进行点评？" name="1">
                                    <div class="right-futitle">当时间到订单的入住时间时，订单自动变更为“入住中”状态，您即可对本次入住进行客观真实的点评。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="为什么我的点评显示审核未通过？" name="2">
                                    <div class="right-futitle">可能您的点评内容中含有诽谤、侮辱等违规词语，点评中含有不实或与入住无关的内容，请您修改后再次提交，确保点评符合客观事实且语言文明。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
    
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititletwo">评论操作</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                              <el-collapse-item class="right-title" title="如何进行评论？" name="3">
                                    <div class="right-futitle">登录“蚂蚁”，进入“账号昵称”，在“我的订单”->“订单管理”中进行评论。或在APP中“订单”中评论。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="如何修改评论？" name="4">
                                    <div class="right-futitle">房客评论是不支持自行修改的，需要您发布评论的手机联系蚂蚁客服申请修改。</div>
                                </el-collapse-item>
                                <el-collapse-item class="right-title" title="能多次评论吗？" name="5">
                                    <div class="right-futitle">不能，目前房客评论有入住完成后的评价和追加评论两次评论。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                    </div>
                </div>
                <!-- 优惠劵 -->
                 <div class="tab-pane fade" id="yhj">
                    <div class="baoguo">
    
                        <div class="right-zhengti">
                            <div class="right-kuaititle">优惠券规则</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                                <el-collapse-item class="right-title" title="优惠券使用规则是什么？" name="1">
                                    <div class="right-futitle">单笔订单只能使用一张减免券，且不能与其他任一券叠加使用，减免券是有金额要求的，具体的以减免券券免金额为准。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
    
                        <div class="right-zhengtitwo">
                            <div class="right-kuaititletwo">获取优惠券</div>
                            <el-collapse v-model="activeNames" @change="handleChange">
                              <el-collapse-item class="right-title" title="如何获得？" name="3">
                                    <div class="right-futitle">优惠券分减免券、代金券两种；蚂蚁短租网站上会推出一些活动，通过参与活动有机会获得代金券或减免券，不同渠道获得的优惠券有效期不同，以券面显示有效期为准。</div>
                                </el-collapse-item>
                            </el-collapse>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<style>
.right-title .right-futitle {
  color: #777776;
    font-size: 12px;
}

.bj {
    background: #fafafa;
}

.help-title {
    width: 100%;
    height: 44px;
    line-height: 44px;
    margin: 20px 0px;
}
.tiaozhuan {
    color: #00848a;
}
.help-waimian {
    width: 100%;
    height: 800px;
    padding: 0px;
}
.help-left {
    width: 18%;
    display: inline-block;
    margin-right: 500px;
    position: absolute;
}
.help-right {
    position: relative;
    left: 30%;
}
#myTab {
    display: block;
}
#myTab li {
    border: 1px solid #ddd;
    float: none;
    width: 100%;
    height: 50px;
}
.left-one,
.left-two {
    font-size: 14px;
}
#myTab li a {
    border: none;
    line-height: 30px;
    text-align: center;
}
#myTab li a:hover {
    border: none;
}
.help-right {
    width: 70%;
    display: inline-block;
}
.right-title div {
    color: #333;
    font-size: 16px;
    cursor: pointer;
}
.right-title div:hover{
color: #00848A
}
.right-futitle {
    font-size: 14px;
    margin-top: 4px;
    padding-bottom: 10px;
}
.right-zhengti {
    background: white;
    padding: 20px 40px 0px 40px;
    margin: 0px
}
.right-zhengtitwo {
    background: white;
    padding: 0px 40px 40px 40px;
    margin: 0px
}
.right-kuaititle,
.right-kuaititletwo {
    width: 100%;
    height: 29px;
    margin-bottom: 16px;
    background: white;
    font-size: 22px;
    color: #333;
    font-weight: normal;
    padding: 0px;
}
.right-kuaititletwo {
    margin-top: 16px;
}
.baoguo{
  background: white;
}
</style>

<script type="text/javascript">
export default {
    data() {
        return {
            activeNames: ["1"]
        };
    },
    methods: {
        handleChange(val) {
            console.log(val);
        }
    }
};
$(function() {
    $('a[data-toggle="tab"]').on("shown.bs.tab", function(e) {
        // 获取已激活的标签页的名称
        var activeTab = $(e.target).text();
        // 获取前一个激活的标签页的名称
        var previousTab = $(e.relatedTarget).text();
        $(".active-tab span").html(activeTab);
        $(".previous-tab span").html(previousTab);
        });
    });
    $("#myTab a").click(function(e) {
        e.preventDefault();
        $(this).tab("show");
    });
</script>